<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Test</title>
</head>
<body>
<div class="input-field col s6">
    <input placeholder="请输入数据" id="text1" type="text" class="validate">
</div>
 
<button type="button" id="button1" onclick="testClick()">JS调用Android 协议好的方法</button>
 
<button type="button" id="button2" onclick="testClick2()">JS调用Android 默认</button>
</body>
<script>
 
         //JS调用Android方法：接收Android传递过来的数据，并做处理
         function testClick() {
 
          //参数一：调用java中的方法   submitFromWeb是方法名，必须和Android中注册时候的方法名称保持一致
          //参数二：返回给Android端的数据，可以为字符串，json等信息
          //参数三：js接收到Android传递过来的数据之后的相应处理逻辑
 
            window.WebViewJavascriptBridge.callHandler(
               'callbackHandler'
               , {'param': "Android你好，这是我JS传递给你的数据呀！！！"}
               , function(responseData) {
                    alert("JS接收到Android数据弹JS对话框："+responseData)
               }
           );
       }
 
       //JS调用Android方法：接收Android传递过来的数据，并做处理 默认
         function testClick2() {
           var data2 = 'JS调用Android方法：接收Android传递过来的数据，并做处理 默认';
          //参数一：调用java中的方法   submitFromWeb是方法名，必须和Android中注册时候的方法名称保持一致
          //参数二：返回给Android端的数据，可以为字符串，json等信息
          //参数三：js接收到Android传递过来的数据之后的相应处理逻辑
 
            window.WebViewJavascriptBridge.send(
            data2,
            function(responseData){
            //java中DefaultHandler所实现的方法中callback所定义的入参
            alert(responseData);
            });
       }
 
 
 
 
       //自定义JS注册事件监听 connectWebViewJavascriptBridge 方法名可改
       function connectWebViewJavascriptBridge(callback) {
           if (window.WebViewJavascriptBridge) {
               callback(WebViewJavascriptBridge)
           } else {
               document.addEventListener(
                   'WebViewJavascriptBridgeReady'
                   , function() {
                       callback(WebViewJavascriptBridge)
                   },
                   false
               );
           }
       }
 
 
 
        //注册回调函数，第一次连接时调用 初始化函数 connectWebViewJavascriptBridge和上面一致
       connectWebViewJavascriptBridge(function(bridge) {
 
            //初始化 必须有 Android 通过 JSBridge 调用 默认JS bridge.init bridgeWebView.send调用
           bridge.init(function(message, responseCallback) {
               var data = {
                   'Javascript Responds': 'Android调用JS初始化方法!'
               };
               responseCallback(data);
           });
 
 
           //Android调用js方法：functionInJs方法名称需要保持一致 ，并返回给Android通知
           bridge.registerHandler("functionInJs", function(data, responseCallback) {
               alert("JS接收到Android数据弹JS对话框："+data);
               var data2 = document.getElementById("text1").value;
               var responseData =data2;
               responseCallback(responseData);
           });
 
 
		   //Android调用js方法：functionInJs方法名称需要保持一致 ，并返回给Android通知
           bridge.registerHandler("calledHandler", function(data, responseCallback) {
               alert("JS接收到Android数据弹JS对话框111："+data);
               var data2 = "dddddddddddddddddddddddddddddddddd";
               var responseData =data2;
               responseCallback(responseData);
           });
       })
 
 
 
</script>
</html>